<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <!-- 2.引入Vue文件 -->
    <script src="js/vue.js"></script>
	<style>
	[v-cloak]{
	display:none;
	}
	</style>
</head>

<body>
	<pre>
	指令：就是自定义属性，只不过指令vue本身就给提供的
	使用方式：将自定义指令当成属性来进行使用
	v-cloak:
	解决的问题：插值表达式闪烁的问题
	原理：将指令写到元素位置，然后把使用display将原属隐藏
		当插值表达式数据解析渲染好之后，vue会在内存中将v-cloak
		指令进行移除，从而将元素显示出来
	</pre>
	<div id="app">
	<div v-cloak>{{name}}</div>
	</div>
	<script>
	var vm=new Vue({
	el:'#app',
	data:{
	name:'Tom'
	}
	})
	</script>
</body>

</html>